import React, { Component } from 'react'

const ctx = React.createContext()

class ChildA extends Component {

    static contextType = ctx

    render() {
        return (
            <h3> ChildA---{this.context.a}</h3>
        )
    }
}

function ChildB(props) {
    return (
        <h3>
            ChildB---
            <ctx.Consumer>
                {
                    (value) => <span>{value.a}---{value.b}</span>
                }
            </ctx.Consumer>
        </h3>
    )
}

export default class NewContextTest extends Component {

    state = {
        a: 1,
        b: 'bbb'
    }

    render() {
        return (
            <ctx.Provider value={this.state}>
                <ChildA />
                <ChildB />
            </ctx.Provider>
        )
    }
}
